'use client';
import { useTranslations } from 'next-intl';
import { Table, theme,Modal, Button} from 'antd';
import { useRouter } from 'next/navigation';
import AvaForm from './AvaForm';
import { useState } from 'react';
import  Columns from './column';
import Layout from '@/components/Layout';
import styles from './index.module.less';
import UseForm from './UseForm';

 
 
 function User() {
  const [list,setList]=useState('')
  const t = useTranslations('user');
  const { token } = theme.useToken();

  const listStyle: React.CSSProperties = {
    background: token.colorFillAlter,
    borderRadius: token.borderRadiusLG,
    padding: 12
  };

  const [isModalOpen, setIsModalOpen] = useState(false);

  const showModal = () => {
    setIsModalOpen(true);
  };

  const handleOk = () => {
    setIsModalOpen(false);
  };

  const handleCancel = () => {
    setIsModalOpen(false);
  };
  return (
    <Layout curActive='/han'>
      <main className={styles.userWrap}>
        <div className={styles.content}>
          <AvaForm />
          <div style={listStyle}>
            <h3>{t('userList2')}</h3>
            {/* 添加按钮 */}
            <Button onClick={()=>{
              setList("添加")
              showModal()
             
            }}>添加</Button>
            
            {/* <UseForm /> */}
              <Columns
              list={list} isModalOpen={isModalOpen} setIsModalOpen={setIsModalOpen} handleOk={handleOk} handleCancel={handleCancel}
              ></Columns>
            
          </div>
        </div>
      </main>
    </Layout>

  );
}
export default User
